<template>
    <div id="main">
       <Header title="喵咪影院"/>
            <div id="content">
                <div class="cinema_menu">
                    <div class="city_switch">
                        全城<i class="iconfont icon-lower-triangle"></i>
                    </div>
                    <div class="brand_swtich">
                        品牌<i class="iconfont icon-lower-triangle"></i>
                    </div>
                    <div class="feature_switch">
                        特色<i class="iconfont icon-lower-triangle"></i>
                    </div>
                </div>
                 <CinemaList/>
            </div>
        <TabBar/>
    </div>
</template>

<script>
import Header from '@/components/Header'
import TabBar from '@/components/TabBar'
import CinemaList from '@/components/cinema/CinemaList'
export default {
    name: 'Cinema',
    components: {
        Header,
        TabBar,
        CinemaList
    }
}
</script>

<style lang ="scss" scoped>
    .cinema_menu { 
        width: 100%; 
        height: 45px; 
        border-bottom: 1px solid $bdColor; 
        @include flex-content(space-around); 
        background: $color; 
    }

</style>
